<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>让坦克开起来</title>
		<style type="text/css">
			input{font-size:26px;margin-top: 20px;}
			body{background-image: url(images/grassland.png);}
			#mytank{position: absolute;left:10px;top:100px}
		</style>
	</head>
	<body>		
		<img id="mytank" src="images/right.png"/>
		<script>
			// 编写代码，让坦克能上下左右移动
			//189000950顾啟思

			//获取坦克图片
			let tank = document.querySelector("#mytank");

			document.onkeydown = keyDown;
		    //在Document对象中注册keyDown事件处理函数
			function keyDown(event){  // 方向键控制元素移动函数
				var event = event || window.event;  // 标准化事件对象
				switch(event.keyCode){  // 获取当前按下键盘键的编码
					case 65 :  // 按下A键，向左移动5个像素
					//改变图片方向
					tank.src = "images/left.png";
						tank.style.left = tank.offsetLeft - 5  + "px";
							break;
					case 68 :  // 按下D键，向右移动5个像素
					//改变图片方向
					tank.src = "images/right.png";
						tank.style.left = tank.offsetLeft + 5 + "px";
							break;
					case 87 :  // 按下W键，向上移动5个像素
					//改变图片方向
					tank.src = "images/up.png";
						tank.style.top = tank.offsetTop  - 5 + "px";
							break;
					case 83 :  // 按下S键，向下移动5个像素
					//改变图片方向
					tank.src = "images/down.png";
						tank.style.top = tank.offsetTop  + 5 + "px";
							break;	
				}
				return false;
			}
			//鼠标禁用右键
			document.onmousedown = function(){
				//0：左键 1： 滚轮 2： 右键
				if(event.button == 2){
					alert("不准用右键！");
					return false;
				}
			}
		</script>
	</body>
</html>
